<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8" />
        <meta name="apple-mobile-web-app-capable" content="yes" />
        <title>{% block title %}Showkees{% endblock %}</title>
        <link rel="apple-touch-icon" href="{{ asset('images/touch-icon.png') }}"/>
        {% block stylesheets %}
            <link rel="stylesheet" type="text/css" href="{{ asset('css/style.css') }}" />
            <link rel="stylesheet" type="text/css" href="{{ asset('css/lightbox.css') }}" />
        {% endblock %}
        {% block javascripts %}
            <script src="{{ asset('js/jquery/jquery-1.7.2.min.js') }}" type="text/javascript"></script>
            <script src="{{ asset('js/confirmation.js') }}" type="text/javascript"></script>
            <script src="{{ asset('js/autohideNotifications.js') }}" type="text/javascript"></script>
            <script src="{{ asset('js/markNotificationsAsRead.js') }}" type="text/javascript"></script>
            <script src="{{ asset('js/lightbox.js') }}" type="text/javascript"></script>
            <script>
                $(document).ready(function()
                {

                    $("#colorMenu li").click(switchColor);

                })

                function switchColor()
                {

                    var style = $(this).attr('class');

                    $("body").attr('class', style);

                    $.post('{{ path('MooiUserBundle_ChangeStyle') }}', {'style': style});

                }
        </script>
        {% endblock %}
        <link rel="shortcut icon" href="{{ asset('favicon.ico') }}" />
        <link href='http://fonts.googleapis.com/css?family=Gloria+Hallelujah' rel='stylesheet' type='text/css'>
    </head>
    {% if app.user != null %}
        <body class="{{ app.user.style }}">
    {% else %}
        <body>
    {% endif %}
        {% block body %}
            <div id="headerWrapper">
                <header>
                    <a href="{{ path('index') }}"><img src="{{ asset('images/logoRegular.png') }}" alt="Showkees" id="logo" /></a>
                    {% if wallOwner is defined %}
                        <h1>
                            <span>van</span> {{ wallOwner.fullname }}
                        </h1>
                        {% endif %}
                        {% if app.user != null %}
                        <ul id="colorMenu">
                            <li class="blue">Blauw</li>
                            <li class="green">Groen</li>
                            <li class="yellow">Geel</li>
                            <li class="orange">Oranje</li>
                            <li class="red">Rood</li>
                            <li class="purple">Paars</li>
                            <li class="pink">Roze</li>
                            <li class="gray">Grijs</li>
                        </ul>
                        <div id="userOptions">
                            <span>Menu</span>
                            <ul>
                                {% if not is_granted('ROLE_TEACHER') %}
                                    <li><a href="{{ path('index') }}">Mijn Showkees</a></li>
                                {% endif %}
                                {% if is_granted('ROLE_ADMIN') %}
                                    <li><a href="{{ path('MooiWallBundle_SubjectIndex') }}">Vakken</a></li>
                                    <li><a href="{{ path('MooiUserBundle_TeacherOverview') }}">Docenten overzicht</a></li>
                                {% endif %}
                                {% if is_granted('ROLE_TEACHER') %}
                                    <li><a href="{{ path('MooiUserBundle_TeacherStudentOverview') }}">Mijn leerlingen</a></li>
                                {% endif %}
                                {% if is_granted('ROLE_ADMIN') %}
                                    <li><a href="{{ path('MooiUserBundle_UserCreate') }}">Account toevoegen</a></li>
                                {% elseif is_granted('ROLE_TEACHER') %}
                                    <li><a href="{{ path('MooiUserBundle_UserCreate') }}">Leerling Toevoegen</a></li>
                                {% endif%}
                                <li><a href="{{ path('MooiUserBundle_UserEdit') }}">instellingen</a></li>
                                <li><a href="{{ path('logout') }}">Uitloggen</a></li>
                            </ul>
                        </div>
                        {% include 'MooiWallBundle:Notification:area.html.twig' %}
                    {% endif %}
                </header>
            </div>
            <div id="contentWrapper">
                {% block columns %}
                    
                {% endblock %}
            </div>
        {% endblock %}
    </body>
</html>
